<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>实验室作业上传系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/static/layui/css/layui.css" media="all">
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
    <style>
        .layui-table-cell {
        font-size:14px;
        padding:0 5px;
        height:auto;
        overflow:visible;
        text-overflow:inherit;
        white-space:normal;
        word-break: break-all;
        }
    </style>
</head>
<body>

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend>考试系统</legend>
</fieldset>
<!--单选框-->

<form class="layui-form" lay-filter="example">

    <div class="layui-form-item">
        <label class="layui-form-label">类型</label>
        <div class="layui-input-block">
            <c:if test="${exam.type==1}">
                <input type="radio" title="收作业" checked="">
            </c:if>
            <c:if test="${exam.type==2}">
                <input type="radio" title="考试" checked="">
            </c:if>
        </div>
    </div>

    <input type="hidden" id="urls" name="urls">
    <div>
        <div class="layui-form-item">
            <label class="layui-form-label">名称</label>
            <div class="layui-input-block">
                <input type="text" name="name" value="${exam.name}" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">时间</label>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" disabled="disabled" value="${exam.startTime}">
                </div>
                <div class="layui-form-mid">-</div>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" disabled="disabled" value="${exam.endTime}">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">课程</label>
            <div class="layui-input-block">
                <select name="classKc" id="classKc" lay-filter="aihao1">
                      <option>${exam.remark2}</option>
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">实验室</label>
            <div class="layui-input-block">
                <select   lay-filter="aihao1">
                    <option>${exam.interestName}</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">规则</label>
            <div class="layui-input-block">
                <textarea  class="layui-textarea" >${exam.desc}</textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button type="button" class="layui-btn layui-btn-normal"  onclick="batchDownload()">批量下载</button>
            </div>
        </div>


        <div class="layui-form-item">
            <div class="layui-input-block">
                <div class="layui-upload-list">
                    <table class="layui-table layui-table-cell" style="width: 1000px;table-layout:fixed" >
                        <thead>
                        <tr>
                            <th style="text-align: center;width: 30px;"><input type="checkbox" id="allboxs" lay-skin="primary" lay-filter="allChoose"/></th>
                            <th style="width: 50px;">姓名</th>
                            <th style="width: 60px;">学号</th>
                            <th style="width: 30px;">交卷</th>
                            <th style="width: 150px;">试卷</th>
                            <th style="width: 30px;">登陆次数</th>
                            <th >登录ip</th>
                            <th style="width: 50px;">下载答题</th>
                        </tr>
                        </thead>
                        <tbody id="demoList">
                        <c:forEach items="${maps}" var ="map">
                            <tr>
                                <td style="text-align: center;"><input type="checkbox" name="boxs" lay-skin="primary" value="${map.file_url}" lay-filter="itemChoose"/></td>

                                <td>${map.name}</td>
                                <td>${map.no}</td>
                                <td>
                                    <c:if test="${map.finish==0}"><span style="color:red">否</span></c:if>
                                    <c:if test="${map.finish==1}"><span style="color:blue">是</span></c:if>
                                </td>
                                <td>${map.sj}</td>
                                <td>${map.login_num}</td>
                                <td  style='width:140px;'>${map.login_ip}</td>
                                <td onclick="xiazai('${map.file_url}')">
                                    <c:if test="${map.finish==1}"><a  style="color: blue" >下载试卷</a></c:if>
                                </td>
                            </tr>
                        </c:forEach>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</form>
<script src="<%=request.getContextPath()%>/static/login/js/jquery-2.1.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/static/layui/layui.js"></script><!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->
<script>
    layui.use(['form', 'layedit', 'laydate', 'upload'], function(){
        var form = layui.form
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate
            ,$ = layui.jquery
            ,upload = layui.upload;
        //日期时间选择器
        laydate.render({
            elem: '#startTime'
            ,type: 'datetime'
        });
        //日期时间选择器
        laydate.render({
            elem: '#endTime'
            ,type: 'datetime'
        });
        //全选
        form.on('checkbox(allChoose)', function (data) {
            var child = $(data.elem).parents('table').find('tbody input[type="checkbox"]');
            child.each(function (index, item) {
                item.checked = data.elem.checked;
            });
            form.render('checkbox');
        });

        //全选和部分选中时候,表头全选按钮的样式变化
        form.on('checkbox(itemChoose)', function (data) {
            var sib = $(data.elem).parents('table').find('tbody input[type="checkbox"]:checked').length;
            var total = $(data.elem).parents('table').find('tbody input[type="checkbox"]').length;
            if (sib == total) {
                $(data.elem).parents('table').find('thead input[type="checkbox"]').prop("checked", true);
                form.render();
            } else {
                $(data.elem).parents('table').find('thead input[type="checkbox"]').prop("checked",
                    false);
                form.render();
            }
        });


    });

    function batchDownload() {
        var namebox = $("input[name^='boxs']");
        var urls = new Array();

        for(i = 0; i < namebox.length; i++) {
            if (namebox[i].checked) {
                if (namebox[i].defaultValue) {
                    urls.push(namebox[i].defaultValue);
                }
            }
        }
        if (urls.length === 0) {
            layer.msg("请先选择")
            return;
        }
        //向服务端发送删除指令
        $.ajax({
            type: "post",
            url: "<%=request.getContextPath()%>/examWork/batchDownload",
            data: JSON.stringify(urls),
            dataType: "json",
            contentType: "application/json",
            success: function (data) {
                console.log(data);
                window.location.href="<%=request.getContextPath()%>"+data.data;
            }
        });
    }
    function xiazai(url){
        window.location.href="<%=request.getContextPath()%>"+url;
    }



</script>

</body>
</html>

